<template>
  <!-- 遍历对象，输出 key 与 value -->
  <ul>
    <li v-for="(value, key) in user" :key="key">
      属性名是：{{ key }} --- 属性值是：{{ value }}
    </li>
  </ul>
</template>

<script setup>
// 定义 user 对象
const user = {
  id: 11,
  name: '小明',
  gender: '男'
}
</script>

<style scoped>
ul {
  list-style: none;
  padding: 0;
  margin: 20px;
  font-size: 18px;
  line-height: 1.8;
}
li {
  padding: 4px 0;
}
</style>